<?php
/**
 * 展会详情
 * User: adophper <hello@adophper.com>
 * Date: 2018/3/22
 * Time: 17:04
 */

use yii\helpers\Html;

$this->title = $model->title;
?>
<?=Html::cssFile('/static/frontend/css/detail.css')?>
<?=Html::jsFile('/static/common/js/Chart.min.js')?>
<?=Html::jsFile('/static/common/js/underscore-min.js')?>
<?=Html::jsFile('/static/common/swiper/swiper.js')?>
<?=Html::cssFile('/static/common/swiper/swiper.min.css')?>
<script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=ZubVDLGbR5Rduah7YW2acfLuGQIgxKse"></script>
<div class="detail">
    <div class="head_banner_bg" style="<?=!empty($model->bg)?'background-image: url('.$model->bg.')' : 'background-color: #222;'?>">
        <div class="contBox">
            <div class="detail_head_title f_relative">
                <div class="col-md-2 col-xs-2 detail_head_title_left">
                    <div class="detail_head_title_left_icon flex img"><img src="<?=$model->logo?>" /></div>
                    <div class="flex detail_head_title_left_star clearfix">
                        <label class="t_yel pull-left">综合评分</label>
                        <div class=" rating-stars pull-left" title="<?=$model->score?>">
                            <span class="empty-stars">
                                <span class="star"><i class="glyphicon glyphicon-star"></i></span>
                                <span class="star"><i class="glyphicon glyphicon-star"></i></span>
                                <span class="star"><i class="glyphicon glyphicon-star"></i></span>
                                <span class="star"><i class="glyphicon glyphicon-star"></i></span>
                                <span class="star"><i class="glyphicon glyphicon-star"></i></span>
                            </span>
                            <span class="filled-stars" style="width: <?=$model->score*20?>%;">
                                <span class="star"><i class="glyphicon glyphicon-star"></i></span>
                                <span class="star"><i class="glyphicon glyphicon-star"></i></span>
                                <span class="star"><i class="glyphicon glyphicon-star"></i></span>
                                <span class="star"><i class="glyphicon glyphicon-star"></i></span>
                                <span class="star"><i class="glyphicon glyphicon-star"></i></span>
                            </span>
                        </div>
                    </div>
                    <p class="detail_head_title_left_ping">
                        <span>已有<i class="t_yel"><?=$model->comments_number?></i>人点评</span>&nbsp;&nbsp;<a href="#comments">我要点评</a>
                    </p>
                </div>
                <div class="col-md-10 col-xs-10 detail_head_title_right f_relative">
                    <h2><?=$model->title?></h2>
                    <p class="flex f_between">
                        <span><i class="iconfont">&#xe6ae;</i><?=$data['show_start']?>-<?=$data['show_end']?></span>
                        <?php
                        if ($data['diff_time'] > 0) {
                            ?>
                            <span class="exhibition-time"><em>距开展</em><strong><?=$data['diff_time']?></strong><em>天</em></span>
                            <?php
                        }else if ($data['diff_time'] == 0){
                            ?>
                            <span class="exhibition-time">开幕中</span>
                            <?php
                        }else{
                            ?>
                            <span class="exhibition-time">已经结束</span>
                            <?php
                        }
                        ?>
                    </p>
                    <p class="flex f_between">
                        <span><i class="iconfont">&#xe609;</i><?=$model->hall_title?></span>
                    </p>
                    <div class="list_head_title_tab flex">
                        <span class="flex f_center btn_red"><i class="iconfont">&#xe665;</i>展商报名</span>
                        <span class="flex f_center btn_yel"><i class="iconfont">&#xe608;</i>观众登记</span>
                    </div>
                    <div class="detail_share flex f_between f_relative">
                        <label>分享到：</label>
                        <ol class="fbox">
                            <li class="fl iconfont" onclick="shareTo('sina', '<?=Yii::$app->system->getValueByCode("share_sina_key")?>')">&#xe62f;</li>
                            <li class="fl iconfont  share_wechat_btn">&#xe611;</li>
                            <li class="fl iconfont" onclick="shareTo('qzone', '')">&#xe619;</li>
                            <li class="fl iconfont" onclick="shareTo('qqweb', '<?=Yii::$app->system->getValueByCode("share_tencent_key")?>')">&#xe63d;</li>
                        </ol>
                        <div class="share_wechat img">
                            <img src="<?=Yii::$app->system->getValueByCode("qrcode")?>" />
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="contBox">
        <div class="detailMin_box">
            <div class="detailMin_box_title row">
                <div class="col-md-10 col-sm-9 detailMin_box_title_left">
                    <ul class="flex">
                        <li class="flex_tel sel"><a href="#data">展会数据</a></li>
                        <li class="flex_tel"><a href="#introduce">展会介绍</a></li>
                        <li class="flex_tel"><a href="#photo">展会集锦</a></li>
                        <li class="flex_tel"><a href="#video">展会视频</a></li>
                        <li class="flex_tel"><a href="#video">VR展示</a></li>
                        <?php
                        if (!empty($meeting['title'])) {
                        ?>
                        <li class="flex_tel"><a href="#metting">同期会议</a></li>
                        <?php
                        }
                        if (!empty($model->booth_info)) {
                        ?>
                        <li class="flex_tel"><a href="#booth_info">展位信息</a></li>
                        <?php
                        }
                        ?>
                        <li class="flex_tel"><a href="#position">地理位置</a></li>
                        <li class="flex_tel"><a href="#comments">展会点评</a></li>
                    </ul>
                </div>
                <div class="col-md-2 col-cm-3 detailMin_box_title_right flex">
                    <div class="detailMin_box_title_search f_relative exhibition_search">
                        <input type="text" placeholder="请输入查找内容" />
                        <em class="btn_red iconfont" data-url="<?=Yii::$app->urlManager->createUrl(['zhanhui/index', 'starttime' => ''])?>">&#xe643;</em>
                    </div>
                </div>
            </div>
            <div class="detailMin_box_min">
                <!--左边正文内容-->
                <div class="detailMin_box_min_left fl">
                    <!--数据展示内容-->
                    <div id="data">
                        <div class="detailMin_box_min_left_title flex f_between">
                            <span>展会数据</span>
                            <div class="checkbox">
                                <label class="compare_to" data-id="<?=$model->id?>"><input type="checkbox" class="checkbox"  id="compare_<?=$model->id?>" <?=isset($compareData[$model->id])?'checked="checked"':''?> /> 加入对比</label>
                            </div>
                        </div>
                        <div class="detailMin_box_min_left_top_title flex f_center">
                            <i class="iconfont">&#xe6a3;</i>
                            <span>展览面积</span>
                            <p>
                                <i class="sanj_right"></i>
                                <em><?=number_format($model->area)?></em>
                                <b>平方米</b>
                            </p>
                        </div>
                        <div class="row chart_box">
                            <div class="col-md-6 chart_item">
                                <div class="detailMin_box_min_left_top_title flex f_center" style="background-color: #ebebeb;">
                                    <span>参展商数量</span>
                                    <p>
                                        <em><?=number_format($model->business_number)?></em>
                                        <b>家</b>
                                    </p>
                                </div>
                                <?php
                                if (!empty($businessData)) {
                                ?>
                                <div class="chart_item_min f_relative" id="">
                                    <div class="chart_item_title">
                                        <span>参展商构成</span>
                                    </div>
                                    <div class="text-center" id="pieChartBusiness"></div>
                                </div>
                                <script>
                                    getAjaxPage('<?=Yii::$app->urlManager->createUrl(['/zhanhui/get-business', 'exhibition_id' => $model->id])?>', {}, 'pieChartBusiness');
                                </script>
                                <?php
                                }
                                ?>
                            </div>
                            <div class="col-md-6 chart_item">
                                <div class="detailMin_box_min_left_top_title flex f_center" style="background-color: #ebebeb;">
                                    <span>专业观众数量</span>
                                    <p>
                                        <em><?=number_format($model->audience_number)?></em>
                                        <b>人</b>
                                    </p>
                                </div>
                                <?php
                                if (!empty($audienceData)) {
                                ?>
                                <div class="chart_item_min f_relative">
                                    <div class="chart_item_title">
                                        <span>专业观众构成</span>
                                    </div>
                                    <div class="text-center" id="pieChartAudience"></div>
                                </div>
                                <script>
                                    getAjaxPage('<?=Yii::$app->urlManager->createUrl(['/zhanhui/get-audience', 'exhibition_id' => $model->id])?>', {}, 'pieChartAudience');
                                </script>
                                <?php
                                }
                                ?>
                            </div>
                        </div>
                    </div>
                    <?php
                    if (!empty($model->video)) {
                    ?>
                    <div id="video">
                        <div class="detailMin_box_min_left_title flex f_between">
                            <span>展会视频</span>
                        </div>
                        <!--视频区域内容-->
                        <div class="video_are">
                            <div class="video_box">
                                <video class="video_box" src="<?=$model->video?>" controls="controls" controls="controls">
                                    您的浏览器不支持视频播放
                                </video>
                            </div>
                        </div>
                        <div class="video_player btn_red flex f_center"><i>VR</i>VR展示</div>
                    </div>
                    <?php
                    }
                    if (!empty($meeting['title'])) {
                    ?>
                    <div id="metting">
                        <div class="detailMin_box_min_left_title flex f_between">
                            <span>同期会议</span>
                        </div>
                        <div class="same_period">
                            <p class="meeting_title t_red"><?=$meeting->title?></p>
                            <p>会议时间：<?=$meeting->starttime?> <i>至</i> <?=$meeting->endtime?></p>
                            <p>会议地址：<?=$meeting->address?></p>
                            <p>主办方：<?=$meeting->sponsor?></p>
                            <?php
                            if ($meetingOver) {
                            ?>
                            <a href="javascript:;" id="userMeeting" class="btn_red flex f_center <?=$hasRegisterMeeting?'disabled':''?>"><i class="iconfont">&#xe606;</i><span><?=$hasRegisterMeeting?'已登记':''?>会议提醒</span></a>
                            <?php
                            }
                            ?>
                        </div>
                    </div>
                    <?php
                    }

                    if (!empty($exhibitor)){
                    ?>
                    <div id="exhibitor">
                        <div class="detailMin_box_min_left_title flex f_between">
                            <span>知名展商</span>
                        </div>
                        <ul class="other_recom row clearfix">
                            <?php
                                foreach ($exhibitor as $val) {
                            ?>
                            <li class="col-md-6 left">
                                <p class="t_o"><?=$val['name']?></p>
                            </li>
                            <?php
                                }
                            ?>
                        </ul>
                    </div>
                    <?php
                    }
                    ?>
                    <div id="introduce">
                        <div class="detailMin_box_min_left_title flex f_between">
                            <span>展会介绍</span>
                        </div>
                        <div class="txt_body img">
                            <?=$model->introduce?>
                        </div>
                    </div>
                    <?php
                    if (!empty($picture)) {
                    ?>
                    <!-- 展会集锦 -->
                    <div class="detail-picture" id="photo">
                        <div class="detail-picture-content f_relative">
                            <div class="swiper-container" id="picture">
                                <div class="swiper-wrapper">
                                    <?php
                                    foreach ($picture as $val) {
                                    ?>
                                    <div class="swiper-slide" title="<?=$val['filename']?>" style="background-image: url('<?=$val['fileUrl']?>_820x425.jpg')"></div>
                                    <?php
                                    }
                                    ?>
                                </div>
                            </div>
                            <div class="picture-nav picture-prev flex">
                                <span class="picture_prev"><i class="glyphicon glyphicon-menu-left"></i></span>
                            </div>
                            <div class="picture-nav picture-next flex">
                                <span class="picture_next"><i class="glyphicon glyphicon-menu-right"></i></span>
                            </div>
                        </div>
                        <div class="clearfix picture-page img" id="picture-page">
                            <div class="swiper-container swiper-thumbs gallery-thumbs" id="thumbs">
                                <div class="swiper-wrapper">
                            <?php
                            if (!empty($picture)) {
                                foreach ($picture as $i => $val) {
                            ?>
                            <div class="swiper-slide" title="<?=$val['filename']?>" style="background-image: url('<?=$val['fileUrl']?>_175x110.jpg')"></div>
                            <?php
                                }
                            }
                            ?>
                                </div>
                            </div>
                        </div>
                        <script>
                            var galleryTop = new Swiper('#picture', {
                                spaceBetween: 10,
                                loop:true,
                                loopedSlides: 5, //looped slides should be the same
                                navigation: {
                                    nextEl: '.picture_next',
                                    prevEl: '.picture_prev'
                                },
                            });
                            var galleryThumbs = new Swiper('#thumbs', {
                                spaceBetween: 10,
                                slidesPerView: 4,
                                touchRatio: 0.2,
                                loop: true,
                                loopedSlides: 5, //looped slides should be the same
                                slideToClickedSlide: true,
                            });
                            galleryTop.controller.control = galleryThumbs;
                            galleryThumbs.controller.control = galleryTop;
                        </script>
                    </div>
                    <?php
                    }
                    ?>
                    <?php
                    if (!empty($model->sponsor)) {
                    ?>
                    <div id="sponsor">
                        <div class="detailMin_box_min_left_title flex f_between">
                            <span>主办机构</span>
                        </div>
                        <div class="other_recom other">
                            <?=$model->sponsor?>
                        </div>
                    </div>
                    <?php
                    }
                    if (!empty($model->undertook)) {
                    ?>
                    <div id="undertook">
                        <div class="detailMin_box_min_left_title flex f_between">
                            <span>承办机构</span>
                        </div>
                        <div class="other_recom other">
                            <?=$model->undertook?>
                        </div>
                    </div>
                    <?php
                    }
                    if (!empty($model->scope)) {
                    ?>
                    <div id="scope">
                        <div class="detailMin_box_min_left_title flex f_between">
                            <span>展会范围</span>
                        </div>
                        <div class="other_recom other img">
                            <?=$model->scope?>
                        </div>
                    </div>
                    <?php
                    }
                    if (!empty($model->booth_info)) {
                    ?>
                    <div id="booth_info">
                        <div class="detailMin_box_min_left_title flex f_between">
                            <span>展位信息</span>
                        </div>
                        <div class="recom_table_box img">
                            <?=$model->booth_info?>
                        </div>
                    </div>
                    <?php
                    }
                    ?>
                    <div id="position">
                        <div class="detailMin_box_min_left_title flex f_between">
                            <span>地理位置</span>
                        </div>
                        <div class="addr_are">
                            <div class="addr_box" id="allMap"></div>
                        </div>
                        <script>
                            var point = {
                                lng: '<?=$data['hall']['lng']?>',
                                lat: '<?=$data['hall']['lat']?>'
                            }
                            var map = new BMap.Map("allMap");    // 创建Map实例
                            map.centerAndZoom(new BMap.Point(point.lng, point.lat), 15);  // 初始化地图,设置中心点坐标和地图级别
                            //添加地图类型控件
                            map.addControl(new BMap.MapTypeControl({
                                mapTypes:[
                                    BMAP_NORMAL_MAP,
                                    BMAP_HYBRID_MAP
                                ]}));
                            map.setCurrentCity("<?=$model->city?>");          // 设置地图显示的城市 此项是必须设置的
                            map.enableScrollWheelZoom(true);     //开启鼠标滚轮缩放
                            var marker = new BMap.Marker(new BMap.Point(point.lng, point.lat));  // 创建标注，为要查询的地方对应的经纬度
                            map.panBy(new BMap.Point(point.lng, point.lat));
                            map.removeOverlay(marker.getLabel());
                            map.addOverlay(marker);

                        </script>
                    </div>
                    <div id="comments">
                        <div class="detailMin_box_min_left_title flex list">
                            <span class="sel">观众点评</span>
<!--                            <span>展商点评</span>-->
                        </div>
                        <div class="addr_are img">
                            <img src="/static/frontend/image/comments.jpg" />
                        </div>
                    </div>
                </div>
                <!--右侧直通车-->
                <div class="detailMin_box_min_right fr">
                    <!-- //同期展会 -->
                    <?= frontend\widgets\SameExhibition::widget(['exhibition_id' => $model->id])?>
                    <div class="detailMin_box_min_right_title flex f_between f_relative">
                        <i class="iconfont btn_red">&#xe65f;</i>
                        <span>热门展会</span>
                        <!--<em>更多<i></i></em>-->
                    </div>
                    <div class="foot_line"></div>
                    <?= \frontend\widgets\Hotexhibition::widget()?>
                    <!-- //谁来参展 -->
                    <?= frontend\widgets\Exhibitor::widget()?>
                    <div class="detailMin_box_min_right_recommoned img">
                        <?=\frontend\widgets\Ad::widget(['position' => 'zhanhui_detail_right_bottom'])?>
                    </div>
                </div>
                <div class="clearfix"></div>
            </div>
        </div>

        <div class="divider"></div>
    </div>
</div>
<?=$this->render('compare-tpl')?>
<script>
var userId = '<?=Yii::$app->user->getId()?>';
$(function () {
    $("#userMeeting").on('click', function (e) {
        e.preventDefault();
        if (userId == '') {
            alert('您当前未登录');
            return false;
        }
        if ($(this).hasClass('disabled')) {
            return false;
        }

        $.post('<?=Yii::$app->urlManager->createUrl(['zhanhui/user-meeting'])?>', {exhibition_id: '<?=$model->id?>', meeting_id: '<?=$meeting->id?>'}, function (response) {
            if (response.code == 0) {
                alert('登记成功');
                $("#userMeeting").addClass('disabled');
                $("#userMeeting span").html('已登记会议提醒');
            }else{
                alert(response.msg);
            }
        }, 'json');

    })
})
</script>
